<script setup>
import { ref } from 'vue'
import { getAddPatient, getEditPatientInfo, getPatientDetail } from '@/apis/user';


const isDefault = ref([0])
// 表单数据
const formData = ref({
  name: '',
  idCard: '',
  gender: 1,
  defaultFlag: 1
}) 
const form=ref(null)

//checked 改变时触发 change 事件
const onChangeSwith=(e)=>{
 formData.value.defaultFlag=e.detail.value? 1:0
}

//定义正则
const rules={
	 name: {
	    rules: [
	      { required: true, errorMessage: '请填写患者姓名' },
	      {
	        pattern: '^[\u4e00-\u9fa5]{2,5}$',
	        errorMessage: '患者姓名为2-5位中文'
	      }
	    ]
	  },
	  idCard: {
	    rules: [
	      { required: true, errorMessage: '请输入身份证号' },
	      {
	        pattern:
	          '^[1-9]\\d{5}(?:18|19|20)\\d{2}(?:0[1-9]|10|11|12)(?:0[1-9]|[1-2]\\d|30|31)\\d{3}[\\dXx]$',
	        errorMessage: '身份证号格式不正确'
	      }
	    ]
	  },
	  gender: {
	    rules: [
				{ required: true, errorMessage: '请勾选患者性别' },
				{
					validateFunction(rule,value,data,callback){
						const number=data.idCard.slice(-2,-1)%2
						console.log(number);
						if(number!==value){
							callback('选择的性别与身份号中性别不一致')
						}
						return true
					}
				}
			]
	  }
}


const prop=defineProps({
	id:String
})
uni.setNavigationBarTitle({
	title:prop.id?'编辑患者':'添加患者'
})

//获取患者详情数据
const getPatientDetailInfo=async()=>{
	if(prop.id){
		const res=await getPatientDetail(prop.id)
		const {id,name,gender,idCard,defaultFlag}=res.data
		formData.value={id,name,gender,idCard,defaultFlag}
	}
}
getPatientDetailInfo()

//提交表单
const onSubmit=async()=>{	
	try{
		await form.value.validate()
		prop.id?await getEditPatientInfo(formData.value):	await getAddPatient(formData.value)
	  uni.showToast({
				title:prop.id?'编辑患者成功':'添加患者成功'
			})
		uni.redirectTo({
			url:'/subpkg_archive/list/index'
		})
	}catch(e){
		console.log(e)
	}
}


</script>

<template>
  <scroll-page>
    <view class="archive-page">
      <uni-forms border label-width="220rpx" ref="form" :model="formData" :rules=rules>
        <uni-forms-item label="患者姓名" name="name">
          <uni-easyinput
            placeholder-style="color: #C3C3C5; font-size: 32rpx"
            :styles="{ color: '#121826' }"
            :input-border="false"
            :clearable="false"
            placeholder="请填写真实姓名"
						v-model="formData.name"
          />
        </uni-forms-item>
        <uni-forms-item label="患者身份证号" name="idCard">
          <uni-easyinput
            placeholder-style="color: #C3C3C5; font-size: 32rpx"
            :styles="{ color: '#121826' }"
            :input-border="false"
            :clearable="false"
            placeholder="请填写身份证号"
						v-model="formData.idCard"
          />
        </uni-forms-item>
        <uni-forms-item label="患者性别" name="gender">
          <uni-data-checkbox
            selectedColor="#16C2A3"
            :localdata="[
              { text: '男', value: 1 },
              { text: '女', value: 0 }
            ]"
						v-model="formData.gender"
          />
        </uni-forms-item>
        <uni-forms-item label="默认就诊人" name="name">
          <view class="uni-switch">
            <switch :checked="formData.defaultFlag===1" color="#20c6b2" style="transform: scale(0.7)" @change="onChangeSwith"/>
          </view>
        </uni-forms-item>
        <button class="uni-button" @click="onSubmit">保存</button>
      </uni-forms>
    </view>
  </scroll-page>
</template>

<style lang="scss">
@import './index.scss';
</style>